﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<?xml version="1.0" encoding="utf-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:d="http://www.xidea.org/taglib/decorator" xml:lang="zh_CN"
  lang="zh_CN">
<head>
<meta http-equiv=content-type content="text/html; charset=utf-8">
<script src="../scripts/boot-decorator.js"></script>
<title>测试 Drag Drop</title>
</head>
<style>
body{
    border:30px solid yellow;
}
#outer{
    position:absolute;
    left:110px;
    top:110px;
    border:100px solid blue;
    height:500px;
    width:500px;
    
}
#handle{
    background:#999;
    width:100px;
    height:20px;
}
#target{
    /**/
    /*position:absolute;
    top:10px;*/
    margin:10px;
    background:#DDD;
    overflow:hidden;
    width:100px;
    height:100px;
    border:70px solid red;
}
</style>
<body>
<div id="outer">
	<div id="target">
		<div id="handle">drag me</div>
		<div>content</div>
	</div>
</div>
<script src="../scripts/boot.js"></script>
<script>
$import("org.jside.Draggable",true)
</script>
<script>
var d = new Draggable('handle','target');
</script>
</body>
</html>
